import React, { Component } from 'react'
import Home from "./Home";
import eventBus from './utils/event-bus';
import './index.css'
export class App extends Component {
    constructor(){
        super()
        this.state = {
            name:"",
            age:0,
            height:0
        }
    }
    componentDidMount(){
        //  监听
        // eventBus.on("bannerPrev",(name,age,height)=>{
        //     console.log("APP中监听到BANNERPREV")
        //     this.setState({name,age,height})
        // })
        // eventBus.on("bannerPrev",this.bannerPrevClick.bind(this))
        eventBus.on("bannerPrev",this.bannerPrevClick,this)


    }
    bannerPrevClick(name,age,height){
            console.log("APP中监听到BANNERPREV",name,age,height)
            this.setState({name,age,height})
    }
    componentWillUnmount(){
    // 取消监听
    eventBus.off("bannerPrev",this.bannerPrevClick)
    }
  render() {
    const { name, age , height} = this.state
    return (
      <div className='app'>
        <h2>App Component</h2>
        <div>name:{name}</div>
        <div>age:{age}</div>
        <div>height:{height}</div>
        <hr />
        <Home></Home>
      </div>
    )
  }
}

export default App